<template>
  <div>
    <el-row style="text-align:right">
      <el-input
        placeholder="请输入内容"
        prefix-icon="el-icon-search"
        size="mini"
        style="width:200px;margin-right:20px"
        v-model="txtsearch"
        clearable
      >
      </el-input>
      <el-button size="mini" icon="el-icon-check" @click="onSave">
        保存
      </el-button>
    </el-row>
    <p></p>
    <el-table
      border
      :data="sys1Data"
      stripe
      style="width: 100%"
      row-key="System_1_10"
      ref="table"
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="40"> </el-table-column>
      <el-table-column type="index" width="40"> </el-table-column>
      <el-table-column prop="System_1_20" label="用户名"> </el-table-column>
      <el-table-column prop="System_1_40" label="手机"> </el-table-column>
      <el-table-column prop="System_1_120" label="姓名"> </el-table-column>
      <el-table-column prop="System_1_140" label="邮箱"> </el-table-column>
    </el-table>
  </div>
</template>

<script>
import { System1 } from "@/api";
export default {
  data() {
    return {
      sys1Data: [],
      thisDialog: {},
      notUid: [], //过滤的uid
      txtsearch: "",
      multipleSelection: [] //选中
    };
  },
  //外部属性
  props: {},
  //内部方法
  methods: {
    async initPage() {
      const loading = this.$loading({
        target: this.$refs.table.$el,
        lock: true,
        text: "加载中..."
      });
      let sys1data = await System1.get(this.txtsearch, this.notUid);
      this.sys1Data = sys1data;
      this.$nextTick(() => {
        loading.close();
      });
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    onSave() {
      this.thisDialog.$emit("onSys1Save", this.multipleSelection);
    }
  },
  //组件
  components: {},
  //初始化 异步加async await
  mounted() {
    this.initPage();
  },
  //计算属性
  computed: {},
  //监视
  watch: {
    txtsearch() {
      this.initPage();
    }
  }
};
</script>

<style></style>
